<template>
	<view class="seekItem" @click="onClick">
		<image class="img" mode="aspectFill" :src="info.url"></image>
		<view class="info">
			<view class="name">姓名：{{ info.name }}</view>
			<view class="item">性别：{{ info.sex }}</view>
			<view class="item">年龄：{{ info.age }}</view>
			<view class="item">走失地：{{ info.lost_place }}</view>
			<view class="item">走失时间：{{ info.lost_time }}</view>
			<!-- <view class="btn" @click="onClick">
				<span>
						{{ info.status }}
				</span>
			</view> -->
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			info: {
				type: Object,
				default () {
					return {}
				}
			}
		},
		data() {
			return {};
		},
		methods: {
			onClick() {
				uni.navigateTo({
					url: `/pages/index/MsgDetail/MsgDetail?id=${this.info.id}`
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.seekItem {
		margin: 10px 0;
		padding: 10px 12px;
		background-color: white;
		display: flex;
		color: #555555;
		border-radius: 3px;
		&:active {
			background-color: #F2EEEE;
		}
		.img {
			width: 100px;
			margin-right: 10px;
			height: 140px;
			border-radius: 3px;
		}

		.info {
			flex: 1;
			position: relative;
			.name {
				// color: $uni-color-primary;
			}

			.item {
				margin-top: 3px;
			}

			.btn {
				margin-top: 3px;
				cursor: pointer;
				color: $uni-link-primary;
				position: absolute;
				bottom: 5px;
				span {
					font-size: 10px;
					color: $uni-color-primary;
				}
			}
		}
	}
</style>
